<template>
	<view>
		<div style="height: 50rpx;background:#fff"></div>
		<div class="header">
			<div class="back center" @click="back">
				<image src="/static/icon/back.png" mode="widthFix" class="w-20"></image>
			</div>
			{{$t('受邀绑定')}}
		</div>
		<view class="invited_items">
			<view class="invited_item">
				<view class="title">
				{{$t('申请人')}}
				</view>
				<view class="info_text">
					<input class="info_input" v-model="remarkName" disabled="true" />
				</view>
			</view>
			<view class="invited_item">
				<view class="title">
					{{$t('申请说明')}}
				</view>
				<view class="info_text">
					<u-textarea v-model="remarkValue" :customStyle="{background: '#F6F7FB'}" height="200rpx" border="none"></u-textarea>
				</view>	
			</view>
			<!-- <view class="invited_item">
				<view class="title">
				{{$t('附件')}}
				</view>
				<view class="item_photo">
					<image class="ph" src="/static/img/ph_1.png" mode="aspectFill"></image>
					<image class="ph" src="/static/img/ph_1.png" mode="aspectFill"></image>
					<image class="ph" src="/static/img/ph_1.png" mode="aspectFill"></image>
				</view>
			</view> -->
		</view>
		<view class="footer_btn">
			<u-button type="primary"  class="btn_red customStyle" :text="$t('拒绝')" :loading="submit_loading" :disabled="submit_loading" @click="submit_del"></u-button>
			<u-button type="primary"  class="btn_blue customStyle" :text="$t('同意')" :loading="submit_loading" :disabled="submit_loading" @click="submit_sub"></u-button>
		</view>
	</view>
</template>

<script>
	import { invite_status,driver_work} from '@/api/driver'
	import {invite_info} from '@/api/basic'
	
	export default {
		data() {
			return {
				remarkName:'',
				remarkValue:'',
				submit_loading:false,
				driverInfor:{},
				driver_infor:{},
				
				infoList:{}
			}
		},
		onLoad(options) {
			this.driverInfor=JSON.parse(options.dirverInfor)
			 this.remarkName=this.driverInfor.request_user.username
			 
			 this.info()
			 
		},
		methods: {
			info(){
				var that = this
				invite_info({id:this.driverInfor.id}).then((res) => {
					that.infoList = res.data.data.data;
					console.log(that.infoList);
					that.remarkValue = that.infoList.remark.remark
				})
			},
			back() {
					// uni.navigateBack()
					this.cback()
				},

			driverWork(){
				return new Promise((resolve, reject) => {
					let pickerForms={
						register_id:uni.getStorageSync('user_id') || '5809'
					}
				driver_work(pickerForms).then((res) => {
					resolve(res.data.data.data)
				})
				})
			},
		async	submit_sub(){
				this.submit_loading=true
				setTimeout(()=>{
					this.submit_loading=false
				},1000)
				let pickerForms={
					id:this.driverInfor.id,
					status:2
				}
				let result= await this.driverWork()
				
				if(result.bind_user){
					uni.showModal({
						title: '',
						content: this.$t('需从当前公司解绑才能绑定新公司'),
						showCancel:true,
						confirmText:this.$t('申请解绑'),
						success: (res) => {
							if (res.confirm) {
								uni.navigateTo({
									url: '/pages/bindingCompany/invitedDel?driver_infor='+JSON.stringify(result.bind_user)+'&id='+result.id
								});
							}
						}
					});
					return false
				}
				
				invite_status(pickerForms).then((res) => {
					console.log(this.$t('同意'),res)
					uni.showToast({
						'title':'操作成功'
					})
					setTimgout(function(){
						uni.$emit('refreshIndex', true)
						uni.navigateBack({
						  delta: 2,
						})
					},2000)
					
				})
			},
			submit_del(){
				this.submit_loading=true
				setTimeout(()=>{
					this.submit_loading=false
				},1000)
				let pickerForms={
					id:this.driverInfor.id,
					status:3
				}
				invite_status(pickerForms).then((res) => {
					uni.$emit('refreshIndex', true)
					uni.navigateBack({
					  delta: 2,
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
page{
		background-color: #F6F7FB;
	}
.header {
	font-size: 34rpx;
	height: 100rpx;
	line-height: 100rpx;
	font-weight: bold;
	text-align: center;
	position: relative;
	padding-top: var(--status-bar-height);
	background:#fff;
}

.back {
	position: absolute;
	width: 70rpx;
	height: 70rpx;
	top: 18rpx;
}

	.customStyle{
		border: none;
	}
	.invited_items{
		margin: 20rpx 24rpx;
		background: #fff;
		border-radius: 20rpx;
	}
	.invited_item{
		padding:0 24rpx 30rpx;
		.title{
			color: #1D1D1D;
			font-size: 28rpx;
			font-weight: 600;
			line-height: 28rpx;
			padding:34rpx 0 24rpx;
		}
		.info_text{
			border-radius: 18rpx;
			background: #F6F7FB;
			padding:20rpx 24rpx;
			color: #333;
			font-size: 26rpx;
			line-height: 40rpx;
			overflow: hidden;
		}
	}
	.item_photo{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		align-content: flex-start; 
		flex-wrap: wrap;
		gap: 24rpx;
		padding:10rpx 0 30rpx;
		.ph{
			width: 200rpx;
			height: 200rpx;
			flex-shrink: 0;
			border-radius: 20rpx;
		}
	}
	.footer_btn{
		position: fixed;
		left:0;
		bottom: 0;
		right: 0;
		z-index: 9;
		background: #fff;
		padding:30rpx 30rpx 60rpx;
		box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.05);
		display: flex;
		justify-content: space-between;
		.btn{
			width: 100%;
			height: 90rpx;
			border-radius: 50rpx;
			background: linear-gradient(90deg, #278AFF 0%, #66D6E2 100%);
			color:#fff;
			text-align: center;
			line-height: 90rpx;
			font-size: 32rpx;
			font-weight: 600;
		}
		.btn_red{
			width: 45%;
			height: 90rpx;
			border-radius: 50rpx;
			background: linear-gradient(90deg, #FF5A4B 0%, #FF7C70 100%);
			color:#fff;
			text-align: center;
			line-height: 90rpx;
			font-size: 32rpx;
			font-weight: 600;
		}
		.btn_blue{
			width: 45%;
			height: 90rpx;
			border-radius: 50rpx;
			background: linear-gradient(90deg, #278AFF 0%, #66D6E2 100%);
			color:#fff;
			text-align: center;
			line-height: 90rpx;
			font-size: 32rpx;
			font-weight: 600;
		}
	}
</style>
